diff options
Diffstat (limited to 'app/[lng]/evcp/(evcp)/(eng)/cover/page.tsx')
| -rw-r--r-- | app/[lng]/evcp/(evcp)/(eng)/cover/page.tsx | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/app/[lng]/evcp/(evcp)/(eng)/cover/page.tsx b/app/[lng]/evcp/(evcp)/(eng)/cover/page.tsx new file mode 100644 index 00000000..9f2b2e61 --- /dev/null +++ b/app/[lng]/evcp/(evcp)/(eng)/cover/page.tsx @@ -0,0 +1,77 @@ +import * as React from "react" +import { type SearchParams } from "@/types/table" + +import { getValidFilters } from "@/lib/data-table" +import { Skeleton } from "@/components/ui/skeleton" +import { DataTableSkeleton } from "@/components/data-table/data-table-skeleton" +import { Shell } from "@/components/shell" +import { searchParamsProjectsCache } from "@/lib/projects/validation" +import { InformationButton } from "@/components/information/information-button" +import { getProjectListsForCover } from "@/lib/cover/service" +import { ProjectsTableForCover } from "@/lib/cover/table/projects-table" + +interface IndexPageProps { + searchParams: Promise<SearchParams> +} + +export default async function IndexPage(props: IndexPageProps) { + const searchParams = await props.searchParams + const search = searchParamsProjectsCache.parse(searchParams) + + const validFilters = getValidFilters(search.filters) + + const promises = Promise.all([ + getProjectListsForCover({ + ...search, + filters: validFilters, + }), + + ]) + + return ( + <Shell className="gap-2"> + <div className="flex items-center justify-between space-y-2"> + <div className="flex items-center justify-between space-y-2"> + <div> + <div className="flex items-center gap-2"> + <h2 className="text-2xl font-bold tracking-tight"> + 프로젝트 리스트 + </h2> + <InformationButton pagePath="evcp/projects" /> + </div> + {/* <p className="text-muted-foreground"> + S-EDP로부터 수신하는 프로젝트 리스트입니다. 향후 MDG로 전환됩니다.{" "} + <span className="inline-flex items-center whitespace-nowrap"> + <Ellipsis className="size-3" /> + <span className="ml-1">버튼</span> + </span> + 을 통해 담당자 연락처, 입찰 이력, 계약 이력, 패키지 내용 등을 확인 할 수 있습니다. + </p> */} + </div> + </div> + </div> + + <React.Suspense fallback={<Skeleton className="h-7 w-52" />}> + {/* <DateRangePicker + triggerSize="sm" + triggerClassName="ml-auto w-56 sm:w-60" + align="end" + shallow={false} + /> */} + </React.Suspense> + <React.Suspense + fallback={ + <DataTableSkeleton + columnCount={6} + searchableColumnCount={1} + filterableColumnCount={2} + cellWidths={["10rem", "40rem", "12rem", "12rem", "8rem", "8rem"]} + shrinkZero + /> + } + > + <ProjectsTableForCover promises={promises} /> + </React.Suspense> + </Shell> + ) +} |
